<a href="http://github.com/angular/angular.js/tree/v1.2.0rc1/src/Angular.js#L968" class="view-source btn btn-action"><i class="icon-zoom-in"> </i> View source</a><a href="http://github.com/angular/angular.js/edit/master/src/Angular.js" class="improve-docs btn btn-primary"><i class="icon-edit"> </i> Improve this doc</a><h1><code ng:non-bindable="">ngApp</code>
<div><span class="hint">directive in module <code ng:non-bindable="">ng</code>
</span>
</div>
</h1>
<div><h2 id="Description">Description</h2>
<div class="description"><div class="ng-directive-page ng-directive-ngapp-page"><p>Use this directive to auto-bootstrap an application. Only
one ngApp directive can be used per HTML document. The directive
designates the root of the application and is typically placed
at the root of the page.</p>
<p>The first ngApp found in the document will be auto-bootstrapped. To use multiple applications in an
HTML document you must manually bootstrap them using <a href="api/angular.bootstrap"><code>angular.bootstrap</code></a>.
Applications cannot be nested.</p>
<p>In the example below if the <code>ngApp</code> directive would not be placed
on the <code>html</code> element then the document would not be compiled
and the <code>{{ 1+2 }}</code> would not be resolved to <code>3</code>.</p>
<p><code>ngApp</code> is the easiest way to bootstrap an application.</p>
<p> <h4>Source</h2>
<div source-edit="" source-edit-deps="angular.js" source-edit-html="index.html" source-edit-css="" source-edit-js="" source-edit-json="" source-edit-unit="" source-edit-scenario=""></div>
<div class="tabbable"><div class="tab-pane" title="index.html">
<pre class="prettyprint linenums" ng-set-text="index.html" ng-html-wrap=" angular.js"></pre>
<script type="text/ng-template" id="index.html">
    I can add: 1 + 2 =  {{ 1+2 }}
   </script>
</div>
</div><h2>Demo</h4>
<div class="well doc-example-live animate-container" ng-embed-app="" ng-set-html="index.html" ng-eval-javascript=""></div>
</div></div>
<h2 id="Usage">Usage</h2>
<div class="usage">as attribute<pre class="prettyprint linenums">&lt;ANY ng-app="{angular.Module}"&gt;
   ...
&lt;/ANY&gt;</pre>
as class<pre class="prettyprint linenums">&lt;ANY class="ng-app: {angular.Module};"&gt;
   ...
&lt;/ANY&gt;</pre>
<h4 id="parameters">Parameters</h4><table class="variables-matrix table table-bordered table-striped"><thead><tr><th>Param</th><th>Type</th><th>Details</th></tr></thead><tbody><tr><td>ngApp</td><td><a href="" class="label type-hint type-hint-angular">angular.Module</a></td><td><div class="ng-directive-page ng-directive-ngapp-page"><p>an optional application
<a href="api/angular.module"><code>module</code></a> name to load.</p>
</div></td></tr></tbody></table></div>
</div>
